
var e1_options_dir="images/practice/ejercicio1/option";
var e2_options_dir="images/practice/ejercicio2/option";
var e3_options_dir="images/practice/ejercicio3/option";
var e4_options_dir="images/equations/";

var options=['<select class="grid_3 right"><option value="Cartesiano">Cartesiano</option>',
'<option value="Diferencia">Diferencia</option>',
'<option value="Division">Division</option>',
'<option value="Proyeccion Generalizada">Proyeccion Generalizada</option>',
'<option value="Funcion">Funcion</option>',
'<option value="Interseccion">Interseccion</option>',
'<option value="Proyeccion">Proyeccion</option>',
'<option value="Renombre">Renombre</option>',
'<option value="Seleccion">Seleccion</option>',
'<option value="Union Natural">Union Natural</option>',
'<option value="Union">Union</option></select>'].join('');

$(document).ready(function(){

  var points=0;
  var well=0;

	randomize_opts(1);
	randomize_opts(2);
	randomize_opts(3);
  randomize_opts(4);

	$("a[href='#']").click(function() {
		return false
	});

	$('#practice-nav').disableSelection();
	$('.sortable').sortable().disableSelection();

  $('.rta').droppable({
    accept: "li",
    drop: function(ev, ui) {
                    // Añado el objeto origen a la lista destino
                    $(this).append($(ui.draggable));
                    $(this).css('width','auto').css('height','auto').css('background','white');
                  }
                });

	$('.sortable').sortable().disableSelection();
  	$('.sortable li').draggable({helper:'clone'}).disableSelection();
  	$('.dropped li').draggable({helper:'clone'}).disableSelection();

  	$(".trash_list ").droppable({
  		accept: ".sortable li",
  		drop: function(ev, ui) {
                    // Añado el objeto origen a la lista destino
                    $(this).append($(ui.draggable));
                }
            });

  	$(".sortable").droppable({
  		accept: "li",
  		drop: function(ev, ui) {
                    // Añado el objeto origen a la lista destino
                    $(this).append($(ui.draggable));
                }
            });


	$('.toggle').toggle(function(){
            $('.model').animate({'left':'0%'}, 'slow');
        },function(){
            $('.model').animate({'left':'-47%'}, 'slow');
    });

	$('.practice-nav li:nth(0)').click(function(){
       $("#practice2, #practice3, #practice4").addClass('hidden');
       $("#practice1").removeClass('hidden');
  });

  $('.practice-nav li:nth(1)').click(function(){
       $("#practice1, #practice3, #practice4").addClass('hidden');
       $("#practice2").removeClass('hidden');
  });

  $('.practice-nav li:nth(2)').click(function(){
       $("#practice1, #practice2, #practice4").addClass('hidden');
       $("#practice3").removeClass('hidden');
  });

  $('.practice-nav li:nth(3)').click(function(){
       $("#practice1, #practice2, #practice3").addClass('hidden');
       $("#practice4").removeClass('hidden');
  });


  $('#submit').click(function(){

        if(!confirm("Seguro de enviar esta respuesta?")){
          return false;
        }

        var orderA="1 2 3";
        var orderB="4 5";

        var elementsA='';
        var elementsB='';
        var correct=false;

        $('#sortable1a li').not('img').each(function(){
          elementsA+=$(this).attr('data-index')+" ";
        });

        $('#sortable1b li').not('img').each(function(){
          elementsB+=$(this).attr('data-index')+" ";
        });

        elementsA=elementsA.substring(0,elementsA.length-1);
        elementsB=elementsB.substring(0,elementsB.length-1);

        if(elementsA===orderA && elementsB===orderB){
          correct=true;
        }

        if(!correct){
            $("#grade1").attr('src','images/bad-done.png');
            $(".practice-nav li:nth(0)").css('border-color','#cf2224');
            $(".practice-nav li:nth(0)").css('color','#cf2224');
        }else{
            $("#grade1").attr('src','images/well-done.png');
            $(".practice-nav li:nth(0)").first().css('border-color','green');
            $(".practice-nav li:nth(0)").first().css('color','green');
            points+=1.25;
            well++;
        }

        $("#grade1").animate({'opacity':1},'slow');
        $('#submit, #clear1').detach();

  });


  $('#clear1').click(function(){
      $("#grade1").css('opacity',0);
      var items=$("#trash_list1").children().not(".trash");
      $('#sortable1').append(items);
      $("#trash_list1").children().not(".trash").detach();
      randomize_opts(1);
  });

  $('#submit2').click(function(){

        if(!confirm("Seguro de enviar esta respuesta?")){
          return false;
        }

        var orderA="1 2 3";
        var orderB="4 5";

        var elementsA='';
        var elementsB='';
        var correct=false;

        $('#sortable2a li').not('img').each(function(){
          elementsA+=$(this).attr('data-index')+" ";
        });

        $('#sortable2b li').not('img').each(function(){
          elementsB+=$(this).attr('data-index')+" ";
        });

        elementsA=elementsA.substring(0,elementsA.length-1);
        elementsB=elementsB.substring(0,elementsB.length-1);

        if(elementsA===orderA && elementsB===orderB){
          correct=true;
        }

        if(!correct){
            $("#grade2").attr('src','images/bad-done.png');
            $(".practice-nav li:nth(1)").css('border-color','#cf2224');
            $(".practice-nav li:nth(1)").css('color','#cf2224');
        }else{
            $("#grade2").attr('src','images/well-done.png');
            $(".practice-nav li:nth(1)").first().css('border-color','green');
            $(".practice-nav li:nth(1)").first().css('color','green');
            points+=1.25;
            well++;
        }

        $("#grade2").animate({'opacity':1},'slow');
        $('#submit2, #clear2').detach();
  });


  $('#clear2').click(function(){
       $("#grade2").css('opacity',0);
       var itemsA=$("#sortable2a").children();
       var itemsB=$("#sortable2b").children();
       $('#trash_list2').append(itemsA).append(itemsB);
       $("#sortable2a, #sortable2b").children().detach();
       randomize_opts(2);
  });

  $('#submit3').click(function(){

        if(!confirm("Seguro de enviar esta respuesta?")){
          return false;
        }

        var elements=$('.rta');
        var correct=false;

        var i=1;
        elements.each(function(){
          if($(this).attr('rta')==$(this).find('li').attr('data-index')){
            correct=true;
            i++;
          }else{
            correct=false;
            return false;
          }
        });


        if(!correct){
            $("#grade3").attr('src','images/bad-done.png');
            $(".practice-nav li:nth(2)").css('border-color','#cf2224');
            $(".practice-nav li:nth(2)").css('color','#cf2224');
        }else{
            $("#grade3").attr('src','images/well-done.png');
            $(".practice-nav li:nth(2)").first().css('border-color','green');
            $(".practice-nav li:nth(2)").first().css('color','green');
            points+=1.25;
            well++;
        }

        $("#grade3").animate({'opacity':1},'slow');
        $('#submit3, #clear3').detach();
  });

  $('#clear3').click(function(){
       $("#grade3").css('opacity',0);
       var items=$(".rta li");
       $('#sortable3').append(items);
       $(".rta li").detach();
       randomize_opts(3);
  });

$('#submit4').click(function(){
  var inc=1.25/11;

  var items=$('#pt4 li');
  var good=0;

  items.each(function(){
    var value=$(this).attr('item-name');
    var resp=$(this).find('select option:selected').val();
    if(value===resp){
      $(this).find('span').append('<img src="images/well-done.png">');
      good++;
    }else{
      $(this).find('span').append('<img src="images/bad-done.png">');
    }
  });

  if(good<6){
    $("#grade4").attr('src','images/bad-done.png');
    $(".practice-nav li:nth(3)").css('border-color','#cf2224');
    $(".practice-nav li:nth(3)").css('color','#cf2224');
  }else{
    $("#grade4").attr('src','images/well-done.png');
    $(".practice-nav li:nth(3)").first().css('border-color','green');
    $(".practice-nav li:nth(3)").first().css('color','green');
    well++;
    points+=good*inc;
  }
  $("#grade4").animate({'opacity':1},'slow');
  $('#submit4, #clear4').detach();
  $('.end').css('display','');
});

  $('.end').click(function(){
    $('#slide3 .btn').detach();
    $('#success').html(well);
    $('#failed').html(4-well);
    $('#final').html(points.toFixed(1));
  });
});


var randomize_opts=function(practice){
	var items;
  var limit=7;
	switch(practice){
		case 1:
			 practice=e1_options_dir;
			 items=$('#trash_list li');
		break;
		case 2:
       practice=e2_options_dir;
			 items=$('#trash_list2 li');
       limit=8;
		break;
		case 3:
			practice=e3_options_dir;
			 items=$('#sortable3 li');
       limit=3;
       break;
    case 4:
      practice=e4_options_dir;
      items=$('#trash_list3a li, #trash_list3b li');
      limit=11;
      break;
	}

    if(practice===e4_options_dir){
      var i = 0;
      var item_names=["Cartesiano","Diferencia","Division","Interseccion","Union Natural","Union",
                  "Seleccion","Proyeccion","Renombre","Proyeccion Generalizada","Funcion"];

      var images=["cartesiano","diff","division","intersect","union_nat","union",
                  "seleccion","proyeccion","renombre","ext_proyeccion","funcion"];

      items.each(function(){
        $(this).attr('item-name',item_names[i]);
        var img=$(this).find('img');
        img.attr('src',practice+images[i]+".png");
        img.after(options);
        i++;
      });

    }
    else{
      var rand="";
      for (var i = 0; i < limit;) {
        append=Math.floor((Math.random()*limit)+1)+' ';
        if(rand.indexOf(append)<0){
          rand+=append;
          i++;
        }
      };

      rand=rand.substring(0,rand.length-1).split(' ');
      var i = 0;
      items.each(function(){
        $(this).attr('data-index',rand[i]);
        var img=$(this).find('img');
        img.attr('src',practice+rand[i]+".png");
        i++;
      });
    }
}





